<template>
	<view class="Evaluate">
		<view class="content" v-if="item">
			<view class="evaluateContent" v-for="i in item" :key="i">
				<view class="portrait">
					<image :src="i.avatar||'/pagesA/static/微信图片_20201124091755.png'" mode=""></image>
					<view>{{i.nickname}}</view>
					<SxRate v-model="i.score" :size="12" :touchable="false" :disabled="true" />
				</view>
				<view class="time">
					{{i.date_add}}
				
				</view>
				<view class="content">
					{{i.content}}
				</view>
				<view class="Img" v-if="i.images">
					<image v-for="ii in i.images" :key="ii" :src="ii||'/pagesA/static/微信图片_20201124091755.png'" ></image>
				</view>
			</view>
		<BottomStatus></BottomStatus>
		</view>
		<view class="content1" v-else>
			<image src="../static/hezi.png" mode="widthFix"></image>
			<view class="">
				新品上架暂时还没有评价<br/>快购买一个给我们真实的评价吧
			</view>
		</view>
	</view>
</template>

<script>
		import SxRate from '@/components/sx-rate/index.vue'
	import BottomStatus from '@/components/BottomStatus/BottomStatus.vue'
	
	export default {
		components:{SxRate,BottomStatus},
		data() {
			return {
				star:4.5,
				active:'1',
				page:1,
				item:[],
				goods_id:''
			};
		},
		onLoad(e) {
			console.log(e.goods_id)
			this.goods_id=e.goods_id
			this.commentList(e.goods_id)
		},
		onReachBottom() {
			this.page++
			this.commentList(this.goods_id)
		},
		methods:{
			changeOption(e){
				this.active=e
			},
			commentList(e){
				this.$request('/app/goods/commentList','post',{
					access_token:uni.getStorageSync('access_token').replace(/^\"|\"$/g,''),
					goods_id:e,
					page:this.page
				}).then(res=>{
					res.content.forEach( v=>{
						v.date_add=this.$dateFormat(v.date_add*1000,'Y-m-d H:i:s')
						this.item.push(v)
					})
				})
			},
		}
	}
</script>

<style lang="less" scoped>
	page {
		height: 100%;
		.Evaluate{
			height: 100%;
			.content{
				height: 100%;
				overflow-y: scroll;
				.evaluateContent{
					border-bottom: 1px solid #F7F7F7;
					padding: 30rpx 0;
					margin: 0 30rpx;
					.portrait{
						display: flex;
						align-items: center;
						image{
							width: 30px;
							height: 30px;
						}
						view{
							font-size: 12px;
							font-family: PingFangSC-Regular, PingFang SC;
							font-weight: 400;
							color: #333333;
							margin: 0 5px;
						}
						uni-rate{
							height: 100%;
						}
					}
					.time{
						font-size: 12px;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #777777;
						padding: 10px 0;
					}
					.content{
						font-size: 14px;
						font-family: PingFangSC-Regular, PingFang SC;
						font-weight: 400;
						color: #333333;
					}
					.Img{
						padding-top: 10px;
						overflow-x: scroll;
						image{
							width: 75px;
							height: 75px;
							margin-right: 10px;
						}
					}
				}
			}
			.content1{
				height: 100%;
				display: flex;
				justify-content: center;
				align-items: center;
				flex-direction: column;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				color: #AAAAAA;
				image{
					width: 200px;
				}
				view{
					text-align: center;
				}
			}
		}
	}
</style>
